<template>
  <div class="h-full grid grid-flow-row text-white p-3">
    <div class="flex justify-center items-center text-lg font-semibold">
      数据概览
    </div>
    <div class="flex justify-left items-center ">
      {{ props.data?.接警数 }}
    </div>
    <div class="flex justify-left items-center">
      {{ props.data?.处警数 }}
    </div>
    <div class="flex justify-left items-center">
      {{ props.data?.刑事警情 }}
    </div>
    <div class="flex justify-left items-center">
      {{ props.data?.治安警情 }}
    </div>
    <div class="flex justify-left items-center">
      {{ props.data?.交通警情 }}
    </div>
    <div class="flex justify-left items-center">
      {{ props.data?.纠纷警情 }}
    </div>
    <div class="flex justify-left items-center">
      {{ props.data?.求助警情 }}
    </div>
  </div>
</template>

<script setup lang="ts">
import type { JingQingBI } from "@/apis/jingqingApi";

const props = defineProps({
  data: {
    type: Object as () => JingQingBI,
    require: true,
  },
});
</script>

<style scoped></style>
